<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	
	<title>Trang Trại tôm</title>
	
	<link rel="stylesheet" type="text/css" href="style.css" />
	
	<script type="text/javascript" src="js/jquery.js"></script>
	
	<script type="text/javascript">
		$(document).ready(function(){
		   $("#zone-bar li em").click(function() {
		   		var hidden = $(this).parents("li").children("ul").is(":hidden");
		   		
				$("#zone-bar>ul>li>ul").hide()        
			   	$("#zone-bar>ul>li>a").removeClass();
			   		
			   	if (hidden) {
			   		$(this)
				   		.parents("li").children("ul").toggle()
				   		.parents("li").children("a").addClass("zoneCur");
				   	} 
			   });
		});
	</script>
	
</head>

<body>

	<div id="page-wrap">

		<div id="top-bar">
			<img src="images/logo.png" alt="DZone" class="floatleft" />
			<div id="right-side">
				<img src="images/usericon.jpg" alt="user icon" />&ensp;
				<a href="#" class="first">User Name</a>&ensp;
				<a href="#">Submit New</a>&ensp;
				<a href="#">Logout</a> &emsp;
				<form id="main-search">
							<label for="search-field" id="search-field-label">Search</label>
							<input type="text" tabindex="1" maxlength="255" id="search-field"/>
							<input type="image" alt="Search" value="Search" src="images/search.png" id="search-button"/>  
				</form>
			</div>
		</div>
		
		<div id="zone-bar">
			<ul>
				<li>
					<a href="#"><span>
						Cấu Hình &nbsp;
						<em class="opener-technology">
							<img src="images/zonebar-downarrow.png" alt="dropdown" />
						</em>
					</span></a>
					<ul class="technologysublist">
						<li><a href="#">Danh sách vụ</a></li>
						<li><a href="#">Danh sách thức ăn</a></li>
						<li><a href="#">Thêm mới thức ăn</a></li>
						<li><a href="#">Tạo dữ liệu mẫu</a></li>
						<li><a href="#">Khởi tạo ao chuẩn</a></li>
						<li><a href="#">Hóa chất</a></li>
						<li><a href="#">Danh sách tôm</a></li>
						<li><a href="#">Danh sách cử ăn</a></li>
						
					</ul>
				</li>
				<li>
					<a href="#"><span>
						Quản Lý
						<em class="opener-world">
							<img src="images/zonebar-downarrow.png" alt="dropdown" />
						</em>
					</span></a>
					<ul class="worldsublist">
						<li><a href="#">Quản lý đội sản xuất</a></li>
						<li><a href="#">Quản lý nhân viên</a></li>
						<li><a href="#">Quản lý ao</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><span>
						Nhật Ký
						<em class="opener-science">
							<img src="images/zonebar-downarrow.png" alt="dropdown" />
						</em>
					</span></a>
					<ul class="sciencesublist">
						<li><a href="#">Nhật ký nuôi tôm</a></li>
						<li><a href="#">Xử lý thức ăn</a></li>
						<li><a href="#">Xử lý thuốc</a></li>
						<li><a href="#">Báo cáo hàng ngày</a></li>
						<li><a href="#">Báo cáo đột xuất</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><span>
						Báo Cáo
						<em class="opener-gaming">
							<img src="images/zonebar-downarrow.png" alt="dropdown" />
						</em>
					</span></a>
					<ul class="gamingsublist">
						<li><a href="#">Báo cáo thức ăn</a></li>
						<li><a href="#">Báo cáo môi trường</a></li>
						<li><a href="#">Báo cáo độ tăng trưởng</a></li>
						<li><a href="#">Báo cáo độ kiềm</a></li>
						<li><a href="#">Báo cáo độ trong</a></li>
						<li><a href="#">Báo cáo độ mặn</a></li>
						<li><a href="#">Báo cáo độ oxi hóa</a></li>
						<li><a href="#">Báo cáo hóa chất</a></li>
						<li><a href="#">Báo cáo tổng hợp</a></li>
						<li><a href="#">Báo cáo chỉ tiêu kinh tế</a></li>
					</ul>
				</li>
				<li>
					<a href="#"><span>
						Kế Hoạch
						<em class="opener-lifestyle">
							<img src="images/zonebar-downarrow.png" alt="dropdown" />
						</em>
					</span></a>
					<ul class="lifestylesublist">
						<li><a href="#">Kế hoạch môi trường</a></li>
						<li><a href="#">Kế hoạch hóa chất</a></li>
						<li><a href="#">Kế hoạch thức ăn</a></li>
						<li><a href="#">Tổng kế hoạch thức ăn</a></li>
						
					</ul>
				</li>
				
				<li>
					<a href="#"><span>
						Cài Đặt &nbsp;
						<em class="opener-sports">
							<img src="images/zonebar-downarrow.png" alt="dropdown" />
						</em>
					</span></a>
					<ul class="sportssublist">
						
					</ul>
				</li>
				
			</ul>
		</div>
		
		<div id="main-content">
			
		</div>		
		
	</div>
	
</body>

</html>